/**
 * Created by zyx on 2015/9/26.
 */

window.onload = function () {
    document.getElementById('getImg').onclick = function () {
        var doc = document;
        var iuput1 = doc.getElementById('getImg1');
        var iuput2 = doc.getElementById('getImg2');
        var iuput3 = doc.getElementById('getImg3');

        if(iuput1.value.length == 0) {
            iuput1.click();
        } else if(iuput2.value.length == 0) {
            iuput2.click();
        } else if(iuput3.value.length == 0) {
            iuput3.click();
        }
    };

    for(var i in document.querySelectorAll('input[type="file"]')) {
        (function (num) {
            var input = document.querySelectorAll('input[type="file"]')[i];
            input.onchange = function (e) {
                var doc = document;
                var files = e.target.files;
                if(files && files[0]) {
                    var file = files[0];
                    var reader = new FileReader();
                    reader.onload = function(e) {alert(num)
                        $('#img'+ num +'').attr('src', e.target.result);
                        $('#img'+ num +'').unbind('click');
                        doc.getElementById('img'+ num +'').onclick = function () {
                            doc.getElementById('getImg'+ num +'').click();
                            doc.getElementById('getImg').innerHTML = '点击上传第'+ (num + 1) +'张图片';
                        };
                        if(num == 3) {
                            doc.getElementById('getImg').className += ' disabled';
                            doc.getElementById('getImg').innerHTML = '点击图片更换文件';
                        }
                    };
                    reader.readAsDataURL(file);
                }
            };
        })(parseInt(i) + 1);
    };

    //是否更换图片
    for(var k = 1; k <= document.querySelectorAll('input[name="components"]').length; k ++) {
        (function (num) {
            var doc = document;
            doc.querySelectorAll('label[for="check'+ num +'"]')[0].onclick = function () {
                doc.querySelectorAll('label[for="check1"]')[0].className = 'btn col-xs-4';
                doc.querySelectorAll('label[for="check2"]')[0].className = 'btn col-xs-4';
                this.className = 'btn col-xs-4 active';
                if(doc.getElementById('check'+ num +'').value == 'yes') {
                    doc.getElementById('components').className = 'row-center row-input';
                    doc.querySelectorAll('#components input')[0].className = 'col-xs-8 text-center nec'
                } else {
                    doc.getElementById('components').className = 'row-center row-input hide';
                    doc.querySelectorAll('#components input')[0].className = 'col-xs-8 text-center'
                }
            }
        })(k);
    }

    document.getElementsByTagName('form')[0].onsubmit = function () {
        var doc = document;
        var necList = doc.querySelectorAll('.nec');
        var error = false;
        for(var j = 0; j < necList.length; j ++) {
            var nec = necList[j];
            if(nec.value.length == 0) {
                nec.className += ' error';
                nec.placeholder = '此项必填';
                error = true;
            }
        }

        if(error) {
            return false;
        }
    };
};